<template>
	<view class="common-content">
		<!-- 自定义导航 -->
		<u-navbar title-color="#fff" back-icon-color="#333333" :is-fixed="false" :is-back="false">
			<view class="common-tabs-box">
				<view class="slot-wrap">
					<view class="slot-wrap-left" @tap="back">
						<u-icon name="arrow-left"></u-icon>
					</view>
					<view class="slot-wrap-title">选择院区和场地</view>
				</view>
			</view>
		</u-navbar>
		<view class="common-content-box">
			<!-- 选择院区和场地 -->
			<view class="box-content container" v-show="!isShow">
				<view class="box-content-row" v-for="item in dataList" :key="item.id" @click="chooseItem(item)">
					{{ item.siteName }}
				</view>
			</view>
			<!-- 诊室 -->
			<view class="box-content container" v-show="isShow">
				<view class="box-content-row" v-for="item in dataList" :key="item.id" @click="chooseSiteRoomId(item)">
					{{ item.name }}
				</view>
			</view>
		</view>
		<view class="view-more" v-if="dataList.length > 0">
			{{ isMore ? "点击查看更多" : "没有更多了" }}
		</view>
		<view class="view-more" v-if="dataList.length == 0">
			暂无数据
		</view>
	</view>
</template>

<script>
	import {
		API
	} from "@/config/myApi.js";
	export default {
		data() {
			return {
				isShow: false,
				dataList: [],
				// 院区
				sitePageList: [],
				// sitePageTotal: 0,
				params: {
					page: 1,
					rows: this.$store.state.rows,
				},
				rows: this.$store.state.rows,
				// 场地-诊室
				siteRoomList: [],
				curSiteName: '',
				curName: ''
			};
		},
		onLoad() {
			this.getData(this.params)
		},
		onReachBottom() {
			if (this.isMore) {
				this.params.page++;
				this.addRandomData()
			}
		},
		methods: {
			back() {
				uni.navigateBack()
			},
			// 获取院区
			getData(pram) {
				API.sitePagelist(pram).then(res => {
					if (res.code === 200) {
						let result = res.result.rows;
						// if (result.length != 0) {
						this.sitePageList = result;
						// }
						if (result.length >= this.rows) {
							this.isMore = true;
						} else {
							this.isMore = false;
						}
						// this.dataList = result;
						this.getDataList()
					} else {
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
					console.log('获取院区', res);
				})
			},
			// 获取场地
			getSiteRoom(pram) {
				API.siteRoom(pram).then(res => {
					if (res.code === 200) {
						this.siteRoomList = res.result;
						// this.siteRoomTotal = res.result.total;
						this.getDataList()
					} else {
						uni.showToast({
							title: res.message,
							icon: "none"
						})
					}
					console.log('获取场地', res);
				})
			},
			chooseItem(item) {
				this.curSite = item.siteName;
				this.params = {
					page: 1,
					rows: this.$store.state.rows,
				};
				// console.log(item);
				this.getSiteRoom(item.id)
				this.isShow = true;
			},
			chooseSiteRoomId(item) {
				// console.log(item);
				this.curName = item.name;
				uni.redirectTo({
					url: `/pages/mine/setting/serviceSetting?siteRoomId=${item.id}&curSite=${this.curSite}&curName=${this.curName}`
				})

			},
			getDataList() {
				if (!this.isShow) {
					this.dataList = this.sitePageList;
					console.log('data', this.dataList);
				} else {
					this.dataList = this.siteRoomList;
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.common-content-box {
		padding-top: 30rpx;
	}

	.box-content {
		background-color: #fff;

		&-row {
			height: 100rpx;
			line-height: 100rpx;
			border-bottom: 1px solid #f5f5f5;
		}
	}
</style>
